<template>
    <div>
        <!-- 头部 -->
        <!-- <div class="top_tab1">
            <div class="left1" @click="back()">
                <img  src="../assets/order_center/shangs.png">
            </div>
            <span>分行 / 支行</span>
            <div class="right1">
            </div>
        </div> -->
        <!-- <div class="n"></div> -->
        <div class="brankmain" v-for="(item,index) in bankList" :key="index">
            <div class="brantit">
                <div class="branfh">{{item.type}}</div>
                <div class="brankmti">{{item.name}}</div>
            </div>
            <div class="branaddre" v-if="item.address">
                <div class="branimg"><img src="../assets/product/ditu.png" alt=""></div>
                <div class="branadti">{{item.address}}</div>
            </div>
            <div class="branaddre">
                <div class="branimg"><img src="../assets/product/dianhua.png" alt=""></div>
                <div class="branadti">{{item.owner}} - <span><a :href="'tel:' +item.mobile">{{item.mobile}}</a></span></div>
            </div>
        </div> 
    </div>
</template>
<script>
export default {
  name: "branch",
  data() {
    return {
        bankList:[]
    };
  },
  methods: {
    back: function() {
      this.$router.go(-1);
    },
    bank(){ 
      let self = this;
      let url = "/api/bank/lists"; 
      self.orderList=[];
			self.httpPost(url,{user_id:this.user_id,token:this.token,pagesize:999,p:1},function(res) {
				if (res.code == 200) {   
                self.bankList = res.data;
				}else{
                    self.$dialog.toast({
                            mes: res.msg,
                            timeout: 1000,
                            icon: 'error'
                        });
				} 
      })
    }
  },
   created(){
    document.title = "分行/支行";    
    this.user_id = localStorage.getItem('myid');
    this.token = localStorage.getItem('mytoken'); 
    this.bank()
   } 
};
</script>
<style>
.n {
  height: 0.92rem;
}
.top_tab1 {
  width: 100%;
  padding: 0.2rem 0.3rem;
  background: #fff;
  position: fixed;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.top_tab1 span {
  color: #333;
  font-size: 0.36rem;
  padding-left: 0.8rem;
}
.top_tab1 .right1 {
  width: 1rem;
  display: flex;
  justify-content: space-between;
}
.top_tab1 img {
  width: 0.43rem;
}
.brankmain{
    width:95%;
    height:2rem;
    margin:.2rem auto;
    /* margin:.1rem 0; */
    background:#fff;
    border-radius: .2rem;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
.brantit{
    width:90%;
    margin:0 auto;
    display: flex;
}
.branfh{
    width:.7rem;
    height:.4rem;
    text-align: center;
    line-height:.4rem;
    background:#E63F3F;
    color:#fff;
    border-radius: .1rem;
    margin-right:.2rem;
}
.brankmti{
    font-size:.3rem;
    color:#333;
}
.branaddre{
    width:90%;
    margin:0 auto;
    display: flex;
}
.branimg{
    width:.7rem;
    text-align: center;
}
.branadti{
    font-size:.3rem;
    color:#999;
    margin-left:.2rem;
}
.branadti span{
    color:#12ACD9;
}
</style>
